<template>
    <a-comment>
      <span
        slot="actions"
        key="comment-basic-reply-to"
        @click="handlReply(comment.id, comment.userName,comment.userAvatar)"
      >
        <a href="#my-textarea">回复</a>
      </span>
      <a slot="author" style="font-size: 15px">{{comment.userName}}</a>
      <a
        v-if="comment.parentName!=='无'"
        slot="author"
        class="reply-to"
      >@{{comment.parentName}}</a>
      <a-avatar slot="avatar" :src="comment.userAvatar" alt />
      <p slot="content">{{comment.content}}</p>
      <a-tooltip slot="datetime">
        <span>{{comment.time}}</span>
      </a-tooltip>
      <slot name="childComment"></slot>
    </a-comment>
  </template>
  
  <script>
  export default {
    name: "Comment",
    props: {
      comment: {}
    },
    methods: {
      handlReply(msgId, msgUsername,msgAvatar) {
        this.$emit("handleReply", { msgId, msgUsername ,msgAvatar});
      }
    },
    mounted(){
      
    }
  };
  </script>
  
  <style scoped>
  .reply-to {
    padding-left: 5px;
    color: #409eff;
    font-weight: 500;
    font-size: 15px;
  }
  </style>
  